<<<<<<< HEAD
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <meta content="no-cache" http-equiv="Cache-Control">
    <title>源之东方</title>
    <link href="__STATIC__/css/shopin.css" rel="stylesheet"/>
    <link href="__STATIC__/css/swiper.css" rel="stylesheet"/>
    <link rel="stylesheet" href="__STATIC__/css/loading.css" />
</head>
{include file="public:footer" /}
<body>
<div class="header fixed-bar">
    <div class="center">
        <div class="search">
            <form action="">
                <input class="s-input" type="search" autocomplete="off" placeholder="请输入搜索内容" autosave="unique">
                <a class="s-btn" href="__STATIC__/javascript:;" data-trackid="搜索"></a>
            </form>
        </div>
    </div>
</div><!--//头部结束-->

<div class="content">
    <div class="cate-swiper mt" data-trackid="首页-品类">
        <div class="swiper-title" id="theme_title">
            <div class="swiper-wrapper">
                {volist name="theme" id="vo" key="k"}
                {if condition = "$k eq $max_theme"}
                <div class="swiper-slide swiper-slide-active active" id="slide{$vo.id}" data-id="{$vo.id}" data-load="0">{$vo.name}</div>
                {else /}
                <div class="swiper-slide" id="slide{$vo.id}" data-id="{$vo.id}" data-load="0">{$vo.name}</div>
                {/if}
                {/volist}
            </div>
        </div>
        <div class="swiper-container list list-view" id="container_id" >
            <div class="swiper-wrapper ">
                {volist name="theme" id="vo" key="k"}
                <div class="swiper-slide" data-trackid="{$vo.id}">
                    <ul data-trackid="{$vo.id}">
                    
                    </ul>
                </div>
                {/volist}
            </div>
        </div>
    </div><!-- //首页品类结束 -->

</div>
<script src="__STATIC__/js/zepto.min.js"></script>
<script src="__STATIC__/js/base.min.js"></script>
<script src="__STATIC__/js/swiper.js"></script>
<script src="__STATIC__/js/tab.js"></script>
<script src="__STATIC__/js/shopin.js"></script>
<script>
    //焦点图
    var mySwiper = new Swiper ('.slide-banner', {
        pagination: '.swiper-pagination',
        autoplay: 3000,
        autoplayDisableOnInteraction: false
    });

    //分类swiper
    var titSwiper;
    var conSwiper;
    function goLocation(i){
        conSwiper.slideTo(i, 300, function(){});
        setClass(i);
    }
    var titSwiper = new Swiper('.swiper-title', {
        slidesPerView: 4.5
    });

    var conSwiper = new Swiper('.swiper-container', {
        pagination : '.pagination',
        preloadImages: false,
        lazyLoading: true
    });
    conSwiper.params.onSlideChangeEnd = function(){
        var index = conSwiper.activeIndex;
        var prevIndex = conSwiper.previousIndex;
        if (index > prevIndex){
            titSwiper.slideTo(index, 300, function() {});
            // var slidleft = $("#slide" + index).offset().left;
            var slidwidth = $("#slide" + index).width();
            setClass(index);
        }else{
            titSwiper.slideTo(index, 300, function() {});
            setClass(index);
        };
    };
    $(".swiper-title").find('.swiper-slide').each(function(index, el) {
        $(el).on('click', function(){
            goLocation(index);
        });
    });
    function setClass(i) {
        $(".swiper-title").find('.swiper-slide').each(function(index, el) {
            if (index != i) {
                if ($(el).hasClass("active")) {
                    $(el).removeClass("active");
                }
            } else {
                $(el).addClass("active");
            }
        });
    };

    //选项卡
    $(".tab-wrapper").tab();
</script>
<script src="__STATIC__/js/jquery-3.1.1.min.js"></script>
<script>
    $.noConflict();
    function getInfo(that, theme_id) {
        if(that.attr('data-load') == 1) {
            // 已经加载过
            jQuery('#container_id div ul li').find(".swiper-lazy-loaded").removeClass('swiper-lazy-loaded');
            jQuery('#container_id div[data-trackid="' + theme_id + '"]').addClass('swiper-slide-active');
            var img_list = jQuery('#container_id div[data-trackid="' + theme_id + '"] img');
            for (var i = 0; i < img_list.length; i++) {
                var src = img_list[i].dataset.srcString;
                jQuery(img_list[i]).attr('data-src', src);
            }
        } else {
            jQuery.ajax({
                type : "get",
                dataType : 'json',
                data:{
                    id : theme_id
                },
                url : "/theme_product",
                async : true,
                success:function(data){
                    var data = data.data;
                    if(data.products){
                        that.attr('data-load', 1);
                        jQuery('#container_id div ul li').find(".swiper-lazy-loaded").removeClass('swiper-lazy-loaded');
                        jQuery('#container_id ul[data-trackid="' + theme_id + '"]').empty();
                        jQuery('#container_id div[data-trackid="' + theme_id + '"]').addClass('swiper-slide-active');
                        for (var i = 0; i < data.products.length; i++) {
                            console.log(data.products)
                            var li ='<li><a class="list-item" href="/product/info.html?id=' + data.products[i].id + '" data-trackid="首页-品类一-1"><div class="p"><img class="p-pic" src="'+ data.products[i].url +'"></div><div class="d"><h3 class="d-title clamp" style="height: 22px">' + data.products[i].name + '</h3><p class="discount" style="width: 165px;padding-top: 20px;"><img style="width: 100%;" src="__STATIC__/images_old/img/zpbz.png" /></p><div class="d-main"><p class="price"><span class="s">￥' + data.products[i].price + '(市场价)&nbsp;&nbsp;&nbsp;<em class="n">'+ data.products[i].member_price + '(会员价)</em></span></p></div></div></a></li>';

                            // var li = '<li><a href="/product/info.html?id=' + data.products[i].id + '" data-trackid="首页-品类一-1"><img src="' + data.products[i].url + '" class="swiper-lazy swiper-lazy-loaded" data-src-string="' + data.products[i].url + '"><span class="ellipsis">' + data.products[i].name + '</span></a></li>';
                            jQuery('#container_id div ul[data-trackid="' + theme_id + '"]').append(li);
                        }
                    }
                },
                error:function(error){
                    //异常处理；
                    console.log(error);
                }
            });
        }
    }
    jQuery('#theme_title div div').click(function(){
        var that = jQuery(this);
        var theme_id = that.attr('data-id');
        getInfo(that, theme_id);
    })
    $('#slide{$max_theme}').click();
    $(".swiper-slide-active").click();
</script>
</body>
=======
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <meta content="no-cache" http-equiv="Cache-Control">
    <title>源之东方</title>
    <link href="__STATIC__/css/shopin.css" rel="stylesheet"/>
    <link href="__STATIC__/css/swiper.css" rel="stylesheet"/>
    <link rel="stylesheet" href="__STATIC__/css/loading.css" />
</head>
{include file="public:footer" /}
<body>
<div class="header fixed-bar">
    <div class="center">
        <div class="search">
            <form action="">
                <input class="s-input" type="search" autocomplete="off" placeholder="请输入搜索内容" autosave="unique">
                <a class="s-btn" href="__STATIC__/javascript:;" data-trackid="搜索"></a>
            </form>
        </div>
    </div>
</div><!--//头部结束-->

<div class="content">
    <div class="cate-swiper mt" data-trackid="首页-品类">
        <div class="swiper-title" id="theme_title">
            <div class="swiper-wrapper">
                {volist name="theme" id="vo" key="k"}
                {if condition = "$k eq $max_theme"}
                <div class="swiper-slide swiper-slide-active active" id="slide{$vo.id}" data-id="{$vo.id}" data-load="0">{$vo.name}</div>
                {else /}
                <div class="swiper-slide" id="slide{$vo.id}" data-id="{$vo.id}" data-load="0">{$vo.name}</div>
                {/if}
                {/volist}
            </div>
        </div>
        <div class="swiper-container list list-view" id="container_id" >
            <div class="swiper-wrapper ">
                {volist name="theme" id="vo" key="k"}
                <div class="swiper-slide" data-trackid="{$vo.id}">
                    <ul data-trackid="{$vo.id}">
                    
                    </ul>
                </div>
                {/volist}
            </div>
        </div>
    </div><!-- //首页品类结束 -->

</div>
<script src="__STATIC__/js/zepto.min.js"></script>
<script src="__STATIC__/js/base.min.js"></script>
<script src="__STATIC__/js/swiper.js"></script>
<script src="__STATIC__/js/tab.js"></script>
<script src="__STATIC__/js/shopin.js"></script>
<script>
    //焦点图
    var mySwiper = new Swiper ('.slide-banner', {
        pagination: '.swiper-pagination',
        autoplay: 3000,
        autoplayDisableOnInteraction: false
    });

    //分类swiper
    var titSwiper;
    var conSwiper;
    function goLocation(i){
        conSwiper.slideTo(i, 300, function(){});
        setClass(i);
    }
    var titSwiper = new Swiper('.swiper-title', {
        slidesPerView: 4.5
    });

    var conSwiper = new Swiper('.swiper-container', {
        pagination : '.pagination',
        preloadImages: false,
        lazyLoading: true
    });
    conSwiper.params.onSlideChangeEnd = function(){
        var index = conSwiper.activeIndex;
        var prevIndex = conSwiper.previousIndex;
        if (index > prevIndex){
            titSwiper.slideTo(index, 300, function() {});
            // var slidleft = $("#slide" + index).offset().left;
            var slidwidth = $("#slide" + index).width();
            setClass(index);
        }else{
            titSwiper.slideTo(index, 300, function() {});
            setClass(index);
        };
    };
    $(".swiper-title").find('.swiper-slide').each(function(index, el) {
        $(el).on('click', function(){
            goLocation(index);
        });
    });
    function setClass(i) {
        $(".swiper-title").find('.swiper-slide').each(function(index, el) {
            if (index != i) {
                if ($(el).hasClass("active")) {
                    $(el).removeClass("active");
                }
            } else {
                $(el).addClass("active");
            }
        });
    };

    //选项卡
    $(".tab-wrapper").tab();
</script>
<script src="__STATIC__/js/jquery-3.1.1.min.js"></script>
<script>
    $.noConflict();
    function getInfo(that, theme_id) {
        if(that.attr('data-load') == 1) {
            // 已经加载过
            jQuery('#container_id div ul li').find(".swiper-lazy-loaded").removeClass('swiper-lazy-loaded');
            jQuery('#container_id div[data-trackid="' + theme_id + '"]').addClass('swiper-slide-active');
            var img_list = jQuery('#container_id div[data-trackid="' + theme_id + '"] img');
            for (var i = 0; i < img_list.length; i++) {
                var src = img_list[i].dataset.srcString;
                jQuery(img_list[i]).attr('data-src', src);
            }
        } else {
            jQuery.ajax({
                type : "get",
                dataType : 'json',
                data:{
                    id : theme_id
                },
                url : "/theme_product",
                async : true,
                success:function(data){
                    var data = data.data;
                    if(data.products){
                        that.attr('data-load', 1);
                        jQuery('#container_id div ul li').find(".swiper-lazy-loaded").removeClass('swiper-lazy-loaded');
                        jQuery('#container_id ul[data-trackid="' + theme_id + '"]').empty();
                        jQuery('#container_id div[data-trackid="' + theme_id + '"]').addClass('swiper-slide-active');
                        for (var i = 0; i < data.products.length; i++) {
                            console.log(data.products)
                            var li ='<li><a class="list-item" href="/product/info.html?id=' + data.products[i].id + '" data-trackid="首页-品类一-1"><div class="p"><img class="p-pic" src="'+ data.products[i].url +'"></div><div class="d"><h3 class="d-title clamp" style="height: 22px">' + data.products[i].name + '</h3><p class="discount" style="width: 165px;padding-top: 20px;"><img style="width: 100%;" src="__STATIC__/images_old/img/zpbz.png" /></p><div class="d-main"><p class="price"><span class="s">￥' + data.products[i].price + '(市场价)&nbsp;&nbsp;&nbsp;<em class="n">'+ data.products[i].member_price + '(会员价)</em></span></p></div></div></a></li>';

                            // var li = '<li><a href="/product/info.html?id=' + data.products[i].id + '" data-trackid="首页-品类一-1"><img src="' + data.products[i].url + '" class="swiper-lazy swiper-lazy-loaded" data-src-string="' + data.products[i].url + '"><span class="ellipsis">' + data.products[i].name + '</span></a></li>';
                            jQuery('#container_id div ul[data-trackid="' + theme_id + '"]').append(li);
                        }
                    }
                },
                error:function(error){
                    //异常处理；
                    console.log(error);
                }
            });
        }
    }
    jQuery('#theme_title div div').click(function(){
        var that = jQuery(this);
        var theme_id = that.attr('data-id');
        getInfo(that, theme_id);
    })
    $('#slide{$max_theme}').click();
    $(".swiper-slide-active").click();
</script>
</body>
>>>>>>> 93c40d8086b7a8d5a9aa3548fdc8eb06a4272cf7
</html>